<template>
	<div class="wraper-back-list" :class="{iphoneX:isIphoneX,iphone:isIphone}">
		<div class="line"></div>
		<div class="nav-bar">
			<div class="arrow" @click="goBack"></div>
		</div>
		<div class="tab">
			<span class="on">{{$t('backList-key1')}}</span>
		</div>
		<div class="nav2">
			<div class="left" @click="ctrlShown">{{defaultDay}}</div>
			<div class="right">
				<div>
					<span>{{$t('backList-key3')}}</span>
					<b>{{summary.rebate?summary.rebate:0}} {{currentId}}</b>
				</div>
				<div>
					<span>{{$t('backList-key4')}}</span>
					<b>{{summary.contract?summary.contract:0}} {{currentId}}</b>
				</div>
			</div>
		</div>
		<div class="nav3">
			<span>{{isSuperPartner === '1'?$t('backList-key13'):$t('backList-key5')}}</span>
			<span>{{$t('backList-key6')}}</span>
		</div>
		<div class="content" :class="{noList:list.length===0}">
			<div class="list">
				<van-list
					v-model="loading"
	  				:finished="finished"
	  				:error.sync="loadError"
	  				:offset="offset"
	  				:error-text="$t('loadErr')"
	  				:loading-text="$t('loading')"
	  				:finished-text="$t('loadFinished')"
	  				@load="load"
				>
					<div class="item"  v-for="item of list">
						<div><span>{{item.name}}</span><span>{{item.total}}</span></div>
						<p v-if="isSuperPartner === '1'">
							<span v-if="item.direct && Number(item.direct)">{{$t('backList-key7')}}{{item.direct}}</span>
							<span v-if="item.indirect && Number(item.indirect)">{{$t('backList-key8')}}{{item.indirect}}</span>
						</p>
					</div>
		    		<div class="empty" v-if="list.length===0 && finished">
		    			<p class="img"><img src="../../static/images/empty.png"></p>
		    			<p class="desc">{{$t('noData')}}</p>
		    		</div>
				</van-list>
			</div>
		</div>
		<van-popup
  			v-model="shown"
  			position="bottom"
  			class="back-list-dialog"
		>
  			<van-picker 
  				show-toolbar
  				:title="$t('choiceTime')"
  				:cancel-button-text="$t('cancel')"
  				:confirm-button-text="$t('confirm')"
  				:columns="columns" 
  				@change="onChange" 
  				:default-index="1"
  				@cancel="ctrlShown"
  				@confirm="onConfirm"
  			 />
		</van-popup>
	</div>
</template>
<script src="./backList.js"></script>
<style scoped>
	@import './backList.css';
</style>
<style>
	.back-list-dialog{
		border-radius: 0.18rem 0.18rem 0 0;
	}
	.back-list-dialog .van-picker__toolbar{
		height: 0.9rem;
		line-height: 0.9rem;
		background-color: #F2F4F7;
	}
	.back-list-dialog .van-picker__toolbar .van-picker__cancel{
		color: #0080FF;
		font-weight: 400;
		font-size: 0.29rem;
	}
	.back-list-dialog .van-picker__toolbar .van-picker__title{
		color: #2E3E4D;
		font-weight: 400;
		font-size: 0.29rem;
	}
	.back-list-dialog .van-picker__toolbar .van-picker__confirm{
		color: #0080FF;
		font-weight: 550;
		font-size: 0.29rem;
	}
	.content.noList .van-list__finished-text{
		display: none;
	}
</style>